<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="../include/taglib.jsp"%>
<!doctype html>
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<!--[if lt IE 9]><script src="${ctx}/assets/js/html5.js"></script><![endif]-->
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" href="${ctx}/assets/css/style.css" />
<link rel="stylesheet" href="${ctx}/assets/css/ui.css" />
<script src="${ctx}/assets/js/jquery-1.7.1.min.js"></script>
<script src="${ctx}/assets/js/jquery.infinitescroll.min.js"></script>
<script src="${ctx}/assets/js/jquery.masonry.min.js"></script>
<script src="${ctx}/assets/js/jquery.blockUI.js"></script>
<script src="${ctx}/assets/js/kindeditor-min.js"></script>
<script type="text/javascript">
<!--
	$(function() {
		var $container = $('#container');
		$container.imagesLoaded(function() {
			$container.masonry({
				itemSelector : '.box',
				columnWidth : 100,
				cornerStampSelector : '.corner-stamp'
			});
		});

		$container.infinitescroll({
			debug : true,
			navSelector : '#page-nav', // selector for the paged navigation 
			nextSelector : '#page-nav a', // selector for the NEXT link (to page 2)
			itemSelector : '.box', // selector for all items you'll retrieve
			cornerStampSelector : '.corner-stamp',
			loading : {
				finishedMsg : '已经显示全部内容。',
				msgText : "加载中...",
				img : 'http://i.imgur.com/6RMhx.gif'
			}
		}, function(newElements) {
			// hide new items while they are loading
			var $newElems = $(newElements).css({
				opacity : 0
			});
			// ensure that images load before adding to masonry layout
			$newElems.imagesLoaded(function() {
				// show elems now they're ready
				$newElems.animate({
					opacity : 1
				});
				$container.masonry('appended', $newElems, true);
			});
		});
		
	});
//-->
</script>
<style>
<!--
.corner-stamp div {
	position: relative;
	margin: 0 auto;
	text-align: center;
}

.vote-contain {
	min-height: 250px;
}
-->
</style>
</head>
<body>
	<%@include file="../include/head.jsp"%>
	<div class="vote-contain clearfix" id="container">
		<c:forEach items="${subjects }" var="subject">
			<div class="box ${subject.hasPhoto ? 'photo' : '' }"
				style="width: 650px;">
				<h2 style="font-weight: bold;">标题：${subject.subjectTitle }</h2>
				<a href="#buttons" class="like">编辑</a> | <a href="#buttons" class="like">删除</a>
			</div>
		</c:forEach>
		<div class="corner-stamp">
			<div class="center">
				<img src="${ctx }/assets/images/avatar.png" />
			</div>
			<div style="margin-top: 10px;">
				<a href="${ctx }/vote" class="tagbtn4 addVote">添加投票</a> <a href="#buttons"
					class="tagbtn4">个人资料</a>
			</div>
		</div>
	</div>
	<div id="page-nav">
		<c:if test="${!empty(pos) }">
			<a href="${ctx }/${sessionScope.user.userID }/vote/page/${pos}"></a>
		</c:if>
	</div>
	
</body>
</html>